import React, { Component } from "react";
import Header from "../../components/Header/Header";
import { reqgetgoodsinfo,reqcartadd } from "../../http/api";
   import  "./components/css/index.less"
   import { $pre } from "../../http/http";
   import { Button, Toast } from "antd-mobile";
export default class Detail extends Component {
  constructor() {
    super();
    this.state = {
      list: {},
      goodse:['商品',"详情","评价","推荐"]
    };
  }
  async componentDidMount() {
    let res = await reqgetgoodsinfo({ id: this.props.match.params.id });
    if (res.data.code == 200) {
      this.setState({
        list: res.data.list[0] ? res.data.list[0] : {},
      });
    }
  }
  async addShop(){
    let r=await reqcartadd({
      uid:JSON.parse(localStorage.getItem("isLogin")).uid,
      goodsid:this.props.match.params.id,
      num:1,
      type:2
    })
    if(r.data.code===200){
      Toast.show({
        content:r.data.msg
      })
    }
  }
  render() {
    let { list,goodse } = this.state;
    return (
      <div>
        {" "}
        <Header title="商品详情" back {...this.props}></Header>
       
        <header>
          <div className="headertext">{list.goodsname}</div>
          <div className="bottom">
        {goodse.map((item)=>{
          return(
            <a href="" key={item}>{item}</a>
          )
        })}
     </div>
    </header>
    <div className="banxin">
        <div className="banner"><img src={$pre+list.img} alt="" /></div>
        <aside className="aside1">
            <p>
                <a href="#">{list.price}</a>
                <span className="ccc">{list.market_price}</span>
            </p>
            <p className="banner-hd"> {list.goodsname}</p>
            <ul className="banner-xinxi">

                <li>{list.description}</li>
                <li>11.11限时299元起</li>
                <li>此商品于2020-11-11,00点结束闪购特卖，品牌美妆闪购专场</li>
                <li>【电商洁面热销榜】第{list.isseckill}名</li>
              
            </ul>
        </aside>
    
    </div>
    <Button color="primary" onClick={()=>this.addShop()}>加入购物车</Button>
      </div>
    );
  }
}
